﻿import { Component } from '@angular/core';
declare var $: any;

@Component({
    moduleId: module.id,
    selector: 'sd-home',
    styleUrls: ['personneladmin.component.css'],
    templateUrl:'personneladmin.component.html'
})

export class PersonneladminComponent {
	cNodes =[
	  { id:1, pId:0, name:"IT部门", open:true},
	  { id:11, pId:1, name:"技术部", open:false},
	  { id:111, pId:11, name:"前端部门"},
	  { id:12, pId:1, name:"运维部", open:false},
	  { id:121, pId:12, name:"运维技术部"},
	  { id:13, pId:1, name:"研发部",  open:false},
	  { id:131, pId:13, name:"UI部门",},
	  { id:132, pId:13, name:"产品设计", },
	  { id:133, pId:13, name:"市场调查", },
	  { id:134, pId:13, name:"市场分析", },
	  { id:135, pId:13, name:"市场主管",},
	  { id:136, pId:13, name:"市场助理", },
	  { id:2, pId:0, name:"财务部门", open:true},
	  { id:21, pId:2, name:"财务部",open:false},
	  { id:221, pId:21, name:"财务科长",},
	  { id:222, pId:21, name:"财务副科长"},
	  { id:223, pId:21, name:"会计",},
	  { id:234, pId:21, name:"审计科长",},
	  { id:2341, pId:234, name:"审计副科长",},
	  { id:2342, pId:234, name:"核对副科长",},
	  { id:235, pId:21, name:"出纳",},
	  { id:236, pId:21, name:"会计行政",},
	  { id:3, pId:0, name:"市场部", open:true},
	  { id:31, pId:3, name:"总经理",},
	  { id:321, pId:31, name:"市场1部主管",},
	  { id:322, pId:31, name:"市场2部主管",},
	  { id:323, pId:31, name:"市场3部主管",},
	  { id:334, pId:31, name:"市场4部主管",},
	  { id:3341, pId:334, name:"副主管",},
	  { id:3342, pId:334, name:"市场监督主管",},
	  { id:335, pId:31, name:"市场品质部主管",},
	  { id:336, pId:31, name:"市场调研部",},
	];
	Osetting = {

		data: {
      		simpleData: {
        		enable: true,
        		idkey:'id',
        		pIdkey:'pId',
        		rootPId:0,
      		},
      		key: {
      			name: "name",
      		} 
    	},
    	edit:{
    		enable: true,
    		drag: {
    			isMove: true,
    			isCopy: false,
    		},
    		showRemoveBtn:false,
    		showRenameBtn:false,
    	},
    	callback: {	
    		beforeDrag: this.zTreeBeforeDrag,
    		onDrag: this.zTreeOnDrag,
		}
	};

	zTreeBeforeDrag = function(treeId:number,treeNodes:any){
	   console.log(treeNodes);
	};
	zTreeOnDrag = function(event:string,treeId:number,treeNodes:any){
		console.log(treeNodes);
    };
    Tabledata = [
        { id: 'SN001', name: '张三', telephone: '150-9988-7543', AccountStatus:'fa-check' },
        { id: 'SN002', name: '李四', telephone: '150-2221-7543', AccountStatus: 'fa-remove' },
        { id: 'SN003', name: '张六', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN004', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN005', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN006', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN007', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN008', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN009', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN010', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN011', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN012', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN013', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN014', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN015', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN016', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN017', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN018', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN019', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN020', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN021', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN022', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN023', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN024', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN025', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN026', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
        { id: 'SN027', name: '张三', telephone: '150-9988-7543', AccountStatus: 'fa-check' },
    ];
    changeBoxBodyPost = function () {
        var str = "";
        $('tbody').html('');
        if ($('.content-wrapper').hasClass('fullScreen')) {
            var height = $(window).height() - 182;
        } else {
           height = $(window).height() - 244;
        }
        $('.organization-wrapper').slimScroll({ 'height': height });
        $('div.table-wrapper').css({ 'height': height });
        var TableHeight = $('div.table-wrapper').height() - 90;
        $('table').css('height', TableHeight);
        var trH = $('table tr').height()
        var n = Math.floor(TableHeight / trH);
        var m = this.Tabledata.length;
        n = (n > m) ? m : n;
        for (var i = 0; i < n; i++) {
            str = '<tr><td><input type="checkbox"></td><td>' + this.Tabledata[i].name + '</td><td>' + this.Tabledata[i].telephone + '</td><td>' + this.Tabledata[i].id + '</td><td><i class="fa '+this.Tabledata[i].AccountStatus+'"></i></td><td>...</td>';
            $('tbody').append(str);
        }
    };
	ngOnInit(){
        $.fn.zTree.init($("#organization-tree"), this.Osetting, this.cNodes);
        var that = this;
        $(window).ready(function () {
            that.changeBoxBodyPost();
        });

        $(window).resize(function () {
            that.changeBoxBodyPost();
        });
	}

	FullScreenToggle = function () {
        var backgroundColor = $('.content-wrapper').css('background');
        var that = this;
	    $('.fixed .content-wrapper').fullScreen({

	        'background': backgroundColor,
	        'callback': function (isFullScreen: boolean) {
	            if (isFullScreen == true) {
	                $('.btn-group>button>span').html('退出全屏').attr('title', '退出全屏');
                    $('.content-wrapper').css({ 'padding-top': 0, 'margin-left': 0 });
	                var Height = $(window).height() - 182;
                    $('.organization-wrapper').slimScroll({ 'height': Height });
                    $('.table-wrapper').css('height', Height);
	                    
	                return;
	            }

	            $('.btn-group>button>span').html('全屏').attr('title', '全屏');
                $('.content-wrapper').css({ 'padding-top': '60px', 'margin-left': '230px' });
                that.changeBoxBodyPost();
	        }
	    });
    };

    expandAll = function(){
    	var treeObj = $.fn.zTree.getZTreeObj('organization-tree');
        treeObj.expandAll(true);
    };
    collapse = function(){
        $.fn.zTree.init($("#organization-tree"), this.Osetting, this.cNodes);
    };
    refreshPostmangement = function(){
    	$.fn.zTree.init($("#organization-tree"), this.Osetting, this.cNodes);
    }

    ColumnSet = function(){
    	$('.content-column').show(function(){
    		$('.content-column span').click(function(){
    			$(this).prev().click();
    		});
    		
    	}).mouseleave(function(){
    		var tableObj = [];
    		var tableck =$('.content-column input[type="checkbox"]').filter(":checked");
    		var m=tableck.length;
         	if(m<=0){
         	 return ;
         	}
         	var str = "";
            for(var i=0;i<m;i++){	
            	str +='<td>'+tableck[i].name+'</td>';	
            }
            $(this).hide();
            $('thead').remove();
            $('table').prepend('<tr><td><input type="checkbox" id="checkall"/></td>'+str+'</tr>');   	
    	});
    }

}